import { useStorage } from '@vueuse/core'
import { defineStore } from 'pinia';
import { ref } from 'vue';

export const useNavbarStore = defineStore('navbar', () => {
    const activeMenu = useStorage('activeMenu', ref('/'));
    const dropMenuVisible = useStorage('dropMenuVisible', ref(true))
    const shoppingCar = useStorage('shoppingCar', ref(false))

    function setActiveMenu(menu : any) {
        activeMenu.value = menu;
    }

    function setDropmenuVisible(visible : any) {
        dropMenuVisible.value = visible
    }

    function setShoppingCar(visible : any) {
        shoppingCar.value = visible
    }

    return {
        activeMenu,
        dropMenuVisible,
        shoppingCar,
        setActiveMenu,
        setDropmenuVisible,
        setShoppingCar
    };
})